$(function (){

    //todo write my js code at here
    $.ajax({
        url:"/api/teacher/list"
    }).done(function (data){
        console.log(data)
        let html="";
        let str="";
        data.forEach((element,index)=>{
            html+="<tr>"
            html+="<td>"+element.id+"</td>"
            html+="<td>"+element.name+"</td>"
            html+="<td>"+element.age+"</td>"
            html+="<td>"+element.tno+"</td>"
            element.sex===1?str='女':(element.sex===2?str='男':str='未知')
            html+="<td>"+str+"</td>"
            html+="<td> <a href='#' onclick='showTeacherDlg("+element.id+")'>编辑</a> &nbsp;&nbsp;" +
                "<a href='#' onclick='deleteById("+element.id+")'>删除</a></td>"
            html+="</tr>"
        });
        $("#teacherTb").html(html);



    });
});
document.getElementById('search').addEventListener('click',function () {
    const value = document.getElementById('input').value;
    let style=document.getElementById('style').value;
    $.ajax({
        url: "/api/teacher/list"
    }).done(function (data) {
        let str="";
        if(value.trim()===""||style==="")
        {
            alert("请输入要查询的方式和值");
        }
        else {
            let html1="";
            let html2="";
            html1+="<tr>";
            html1+="<td>"+"id"+"</td>";
            html1+="<td>"+"姓名"+"</td>";
            html1+="<td>"+"年龄"+"</td>";
            html1+="<td>"+"工号"+"</td>";
            html1+="<td>"+"性别"+"</td>";
            html1+="<td>"+"更改"+"</td>";
            html1+="</tr>";
            $('#tableHead').html(html1);
            let flag=0;
            data.forEach((element,index)=>{
                let reduceValue=null;
                let value1;
                //console.log(style)
                switch (style) {
                    case "AAA":{
                        reduceValue=element.name;
                        value1=value.trim();
                        break
                    }
                    case "BBB":{
                        reduceValue=element.tno;
                        value1=value.trim();
                        break
                    }
                    case "CCC":{
                        reduceValue=element.age;
                        value1=parseInt(value.trim(),10);
                        break
                    }
                    default:
                        break

                }
                if(value1===reduceValue){
                    flag=1;
                    html2+="<tr>"
                    html2+="<td>"+element.id+"</td>"
                    html2+="<td>"+element.name+"</td>"
                    html2+="<td>"+element.age+"</td>"
                    html2+="<td>"+element.tno+"</td>"
                    element.sex===1?str='女':(element.sex===2?str='男':str='未知')
                    html2+="<td>"+str+"</td>"
                    html2+="<td> <a href='#' onclick='showTeacherDlg("+element.id+")'>编辑</a> &nbsp;&nbsp;" +
                        "<a href='#' onclick='deleteById("+element.id+")'>删除</a></td>"
                    html2+="</tr>"
                }
            });
            if(flag===0)
            {
                alert("Not found!");

            }
            $('#teacherByName').html(html2);

        }
    });
});


//读取并刷新
function loadTeacherList(){
    $.ajax({
        url:"/api/teacher/list"
    }).done(function (data){
        // console.log(data)
        let html0="";
        let str="";
        data.forEach((element,index)=>{
            html0+="<tr>"
            html0+="<td>"+element.id+"</td>"
            html0+="<td>"+element.name+"</td>"
            html0+="<td>"+element.age+"</td>"
            html0+="<td>"+element.tno+"</td>"
            element.sex===1?str='女':(element.sex===2?str='男':str='未知')
            html0+="<td>"+str+"</td>"
            html0+="<td> <a href='#' onclick='showTeacherDlg("+element.id+")'>编辑</a> &nbsp;&nbsp;" +
                "<a href='#' onclick='deleteById("+element.id+")'>删除</a></td>"
            html0+="</tr>"
        })
        $("#teacherTb").html(html0)
    });
}
let layerIndex;

/**
 * 弹出教师新增/修改对话框
 */
function showTeacherDlg(id){
    let title="新增教师"
    if(id){
        $("#formId").css("display","block");
        //编辑
        title="编辑教师";
        //读取学生信息并赋值
        $.ajax({
            url:"/api/teacher/"+id,
            method: "GET"
        }).done(result=> {
            console.log(result);
            //遍历result对象，并将值填充到#studForm表单当中
            $.each(result, function (key, value) {
                //修改选择器，确保选择器选择的是#studForm内的字段
                var field = $('#teachForm [name="' + key + '"]');

                if (field.is(':radio')) {
                    field.filter('[value="' + value + '"]').prop('checked', true);//选中对应得单选按钮
                } else if (field.is(':checkbox')) {
                    field.prop('checked', value === "yes");//选中复选框
                } else {
                    field.val(value);//填充文本框或其他字段
                }
            });
        });
    }
    else {
        //新增
        $("#teachForm")[0].reset();
        $("#formId").css("display","none");

    }
    layerIndex=layer.open({
        type:1,
        title:title,
        area:['520px','auto'],
        content:$('#teachForm')//捕获层
    });

}

layui.use(function (){
    layui.form.on('submit(stud-dlg)',function (){
        //（1）验证表单是否合法
        event.preventDefault();//阻止表单默认提交
        //执行真正的提交代码
        commitTeaDlg();
    })

});

//编辑功能
function commitTeaDlg(){
    //$("#btnOK").prop("disabled",false).addClass("layui-btn-fluid");//禁用按钮
    let id=$("#id").val();//读取id=id的值
    let formData=$("#teachForm").serialize();
    if(id!=null && id!=""){
        //编辑学生
        $.ajax({
            url: "/api/teacher/update1",
            method:"PUT",
            data:formData
        }).done(result=>{
            sendData(result);
            console.log("111")
            console.log(result)
            console.log("111")
        }).fail((jqXHR,textStatus,errorThrown)=>{
            console.error("Request failed:"+textStatus+"-"+errorThrown);
            //在这里处理错误逻辑
            alert("An error occurred.Please try again.");

        });
    }else{
        //新增学生需要进行

        //（2）将表单信息发送到服务器的insert中，把提交按钮变灰（不可用）

        $.ajax({
            url: "/api/teacher/add",
            method:"POST",
            data:formData
        }).done(result=>{
            sendData(result);


        }).fail((jqXHR,textStatus,errorThrown)=>{
            console.error("Request failed:"+textStatus+"-"+errorThrown);
            //在这里处理错误逻辑
            alert("An error occurred.Please try again.");

        });
    }
    //$("#btnOK").prop("disabled",true).addClass("layui-btn-disabled");//禁用按钮

}
function sendData(result){
    console.log(result);
    if(result.id){

        //（4）读取并刷新原来的学生列表
        loadTeacherList();
        //（3）关闭弹出层
        console.log("add success!");
        if(layerIndex)
            layer.close(layerIndex);
    }
}

//删除功能
function deleteById(id) {
    //
    layer.confirm('确定删除id为：'+id+'的值吗？一旦删除不可恢复', {icon: 3}, function () {
        $.ajax({
            url:"/api/teacher/delete1/"+id,
            method:"DELETE"
        }).done(result=>{
            loadTeacherList();
        });
        layer.msg('删除成功！');
        layer.closeAll();//关闭弹出层
    }, function () {

    });
}

